@charset 'utf-8';
@import  'sandal/core';
@import  'core/mixins', 'core/functions', 'core/vars';

$jobColor: #037cd9;

.ht-job {
	width: $w;
	margin: 0 auto;
	margin-top: -306px;
	background-color: #fff;

	section {
		display: none;

		&.active {
			display: block;
		}
	}

	li {
		cursor: pointer;
	}
}

.ht-job-header {
	@extend %clearfix;

	& > li {
		float: left;
		width: 50%;
		line-height: 110px;
		font-size: $font30;
		text-align: center;
		color: #fff;
		background-color: $jobColor;

		&.active {
			background-color: #16a8e5;
		}
	}
}

.ht-job-content {
	padding: 0 100px;
}

.ht-job-position {
	& > h5 {
		border-bottom: 1px solid #818181;
		line-height: 80px;
		font-size: $font20;
		text-align: center;
	}
}

.ht-job-position-header {
	position: relative;
	@extend %clearfix;
	padding-bottom: 20px;

	li {
		position: relative;
		float: left;
		width: 50%;
		line-height: 40px;
		display: block;

		&.active {
			color: $jobColor;

			&:before {
				content: "";
				position: absolute;
				top: 18px;
				left: -16px;
				width: 5px;
				height: 5px;
				border-radius: 5px;
				background-color: $jobColor;
			}
		}
	}
}

.ht-job-position-content {
	position: relative;

	&:before {
		content: "";
		position: absolute;
		top: 0;
		left: -100px; // 外层容器内间距的大小
		right: -100px;
		height: 2px;
		background-color: #ececec;
	}
}

.ht-info-list {
	padding-bottom: 20px;
	padding-top: 20px;

	& > label {
		font-weight: bolder;
		color: $jobColor;

		address {
			display: inline-block;
			margin-bottom: 0;
		}
	}

	& > p {
		font-weight: bolder;
		color: $jobColor;
	}
}

.ht-info-list-request {
	padding-left: 25px;
	line-height: 2.5;
}

.ht-job-info {
	position: relative;
	padding: 70px 0 24px;
	background: #5ba0ec;
	color: #fff;
	
	&:before {
		content: "";
		position: absolute;
		top: 30px;
		left: 0;
		right: 0;
		width: 30px;
		height: 24px;
		margin: 0 auto;
		background: url("../img/job/msg.png") no-repeat;
	}

	p {
		text-align: center;
		line-height: 1.75;
	}
}